define(function () {
    var wzl = {
        obj: {
            module: document.querySelector('.popups-module'),
            box: document.querySelector('.popups-module-box'),
            head: document.querySelector('.popups-module-header'),
            foot: document.querySelector('.popups-module-footer'),
            clearOverflowStyle: {//防止滚动穿透的样式
                width: '100%',
                height: '100%',
                overflow: 'hidden'
            },
            animationStyle: {//淡入动画
                visibility: 'visible',
                opacity: '1'
            },
            clearAnimationStyle: {//淡出动画
                visibility: 'hidden',
                opacity: '0'
            }
        },
        overflowEle: (function (overflowEle) {
            if (!overflowEle) {//默认最外层滚动元素指向.pages
                overflowEle = '.pages';
                if (document.querySelector(overflowEle)) {
                    overflowEle = document.querySelectorAll(overflowEle);
                }
                else {
                    overflowEle = [];
                    overflowEle.push(document.querySelector('html'));
                    overflowEle.push(document.querySelector('body'));
                }
            } else {
                overflowEle = document.querySelectorAll(overflowEle);
            }
            return overflowEle;
        })(),
        //初始化弹出框宽高和边框圆角
        init: function (width, height) {
            if (width && height) {
                wzl.obj.box.style.width = width + 'px';
                wzl.obj.box.style.height = height + 'px';
                if (wzl.obj.head) {
                    wzl.obj.head.style.top = -height - 34 + 'px';
                    wzl.obj.head.style.width = width + 'px';
                }
                if (wzl.obj.foot) {
                    wzl.obj.foot.style.bottom = -height - 34 + 'px';
                    wzl.obj.foot.style.width = width + 'px';
                    wzl.obj.box.style.borderBottomRightRadius = 0;
                    wzl.obj.box.style.borderBottomLeftRadius = 0;
                }
            } else {
                if (wzl.obj.foot) {
                    wzl.obj.box.style.borderBottomRightRadius = 0;
                    wzl.obj.box.style.borderBottomLeftRadius = 0;
                }
            }
        },
        show: function (ele) {
            ele.style.display = 'block';
            for (var x in wzl.obj.clearOverflowStyle) {
                for (var i = 0; i < overflowEle.length; i++) {
                    overflowEle[i].style[x] = wzl.obj.clearOverflowStyle[x];
                }
            }
            setTimeout(function () {
                for (var x in wzl.obj.animationStyle) {
                    ele.style[x] = wzl.obj.animationStyle[x];
                }
            }, 50);
        },
        close: function (ele) {
            for (var x in wzl.obj.clearAnimationStyle) {
                ele.style[x] = wzl.obj.clearAnimationStyle[x];
            }
            setTimeout(function () {
                ele.removeAttribute('style');
                for (var i = 0; i < overflowEle.length; i++) {
                    overflowEle[i].removeAttribute('style');
                }
            }, 200);
        },
        //第一个参数为触发事件元素，第二个参数为事件类型
        popups: function (triggerEle, eventType) {
            var type;
            triggerEle = document.querySelector(triggerEle);
            overflowEle = wzl.overflowEle;
            eventType == 'tap' ? type = eventType : type = 'click';

            //show
            if (!triggerEle) {
                wzl.show(wzl.obj.module);
            } else {
                triggerEle.addEventListener(eventType, function () {
                    wzl.show(wzl.obj.module);
                });
            }
            //hide
            document.querySelector('.popups-module-wrap').addEventListener(type, function (e) {
                if (e.target == document.querySelector('.popups-module-wrap')) {
                    wzl.close(wzl.obj.module);
                }
            })

        },
        hidden: function (triggerEle, eventType) {
            triggerEle = document.querySelector(triggerEle);
            overflowEle = wzl.overflowEle;
            triggerEle.addEventListener(eventType, function () {
                wzl.close(wzl.obj.module);
            });
        }
    };
    return (function () {
        wzl.init();
        return wzl;
    })();
});